import React, { Component } from 'react';
import { Link } from 'react-router-dom';
// require('./../mock')
class Com extends Component {
  constructor(props) {
    super(props);
    this.state = {
      dat: []
    }
  }
  componentDidMount () {
    fetch('https://sun.daxunxun.com/api/collect')
    .then(res => res.json())
    .then(data => {
      console.log(data)
      this.setState({
        dat: data
      })
    })
  }
  render() {
    let user = this.state.dat
    let arr = []
    for (let i in user){
      // console.log(user[i])
      if(i <6){
        arr.push(
          <li>
            <div className="_Menu_ul_li">
              <img src={require('./../../../img/2.jpg')} alt="" />
              <div className="Follow_Menu_detail">
                <Link to="">{user[i].username}</Link>
                <span>11人关注</span>
                <span>{user[i].uid}个菜谱</span>
              </div>
              <a href="" className="Follow_Menu_det">关注</a>
            </div>
          </li>
        )
      }
      
    }
    return (

      <div className="Follow_Menu">
        <div className="Follow_Menu_nav">
          <b>下厨房的厨友们</b>
          <Link to="" className="Follow_all">更多</Link>
        </div>
        <div className="Follow_Menu_photo">
          <ul className="_Menu_ul">
            {
              arr
            }
          </ul>
        </div>
        <div className="Follow_Menu_more">
          <Link to="">查看更多</Link>
        </div>
      </div>

    )
  }
}

export default Com;